<template>
	<view class="content">

		<radio-group @change="radioChange">
			<view class="item" v-for="(item,index) in list">
				<view class="top" @click="choosesite">
					<view>木棉子 <text>13687985789</text></view>
					<view>上海市科技园区大厦12楼科技有限公司</view>
				</view>
				<view class="bottom">
					<label>
						<radio color="#6165dc" v-if="list.length>1" :value="item" />
						<text v-if="list.length==1"> 默认地址</text>
						<text v-if="list.length>1"> 设为默认</text>
					</label>
					<!-- <myradio></myradio> -->
					<view class="operate">
						<text>
							<image src="../../static/img/edit.png"></image>
							编辑
						</text>
						<text>
							<image src="../../static/img/delete.png"></image>
							删除
						</text>
					</view>
				</view>
			</view>
		</radio-group>




		<button>添加新地址</button>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				list: ['1','2'],
			};
		},
		methods: {
			radioChange(e) {
				console.log(e.detail.value)
			},
			choosesite(){
				uni.navigateTo({
					url:'/pages/scancom/scancom'
				})
			}
		},
		created() {

		}
	}
</script>

<style scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		background: #F9F9F8;
		height: 100vh;
	}

	radio-group {
		width: 100%;

	}

	.item {
		background: #fff;
		padding: 0 20px;
		margin-top: 10px;
	}

	.top view:nth-of-type(2) {
		margin-top: 10px;
		color: #999;
	}

	.operate image {
		vertical-align: middle;
	}

	.operate image:nth-of-type(1) {
		width: 30rpx;
		height: 29rpx;
	}

	.operate image:nth-of-type(2) {
		width: 29rpx;
		height: 32rpx;
	}

	.top,
	.bottom {
		padding: 15px 0;
	}

	.bottom {
		display: flex;
		justify-content: space-between;
		border-top: 2px solid #f4f4f4;
	}

	.operate text {
		margin-right: 20px;
	}

	.operate image {
		margin-right: 6px;
	}

	button {
		width: 690rpx;
		height: 90rpx;
		text-align: center;
		line-height: 90rpx;
		background: #6165DC;
		border-radius: 45rpx;
		color: #fff;
		margin-top: 500rpx;
	}
</style>
